<template>
	<view style="background-color: #FFFFFF;">
		<view class="ling-view"></view>
		<view class="item" v-for="(item,index) in buyList" :key="item.id">
			<view class="item-ad">
				<text class="title">{{item.productName}}</text>
				<view class="detail">
					<text>¥ {{item.amount/100}}</text>
					<text class="time">{{getTimeStamp(item.createTime)}}</text>
				</view>
			</view>
			<view class="line"></view>
		</view>

		<view style="justify-content: center;align-items: center;display: flex;" v-if="buyList.length===0">暂时没有购买记录</view>
	</view>
</template>

<script>
	import utils from '../../utils/utils.js'
	export default {
		data() {
			return {
				buyList: []
			}
		},

		onLoad() {
			this.getOrderList();
		},
		methods: {
			getOrderList() {
				uni.showLoading({});
				this.$http.request({
					method: 'GET',
					url: '/eapi/pay/order_list',
				}).then(res => {
					uni.hideLoading();
					console.log(res);
					this.buyList = res.data;
				}).catch(err => {
					uni.hideLoading();
					console.log(err);
				})
			},
			
			getTimeStamp(isostr) {
				var date = utils.formatISODate(isostr);
				var str = utils.formatDate(date,'yyyy-MM-dd hh:mm:ss');
				return str;
			},
		}
	}
</script>

<style>
	.item {
		padding-left: 40rpx;
		padding-right: 40rpx;
	}

	.item-ad {
		margin-top: 10rpx;
		margin-bottom: 10rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
	}

	.title {
		font-size: 30rpx;
		font-weight: 400;
		line-height: 21px;
		color: rgba(191, 191, 191, 1);
		opacity: 1;

		flex: 1;
	}

	.time {
		font-size: 24rpx;
		color: rgba(191, 191, 191, 1);
		opacity: 1;
	}
	
	.detail{
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		
		font-size:24rpx;
		color:rgba(191,191,191,1);
		opacity:1;
	}
</style>
